<template>
    <el-dialog title="移交客户" :visible="exSellerDialogVisible" :before-close="closeTDialog">
        <el-form :model="newForm" :rules="tFormRules" ref="tForm" label-width="120px">
            <el-form-item label="客户姓名">
                <el-input v-model="newForm.name" disabled/>
            </el-form-item>
            <el-form-item label="旧营销人员">
                <el-input v-model="newForm.sellerName" disabled/>
            </el-form-item>
            <el-form-item prop="selectMktMode" label="新营销人员">
                <el-select v-model="newForm.selectMktMode" style="width: 100%">
                    <el-option
                            v-for="mode in mktLists"
                            :label="mode.name"
                            :key="mode.id"
                            :value="mode.id"
                    />
                </el-select>
            </el-form-item>
            <el-form-item prop="reason" label="移交原因">
                <el-input type="textarea" v-model="reason"></el-input>
            </el-form-item>
        </el-form>
        <div class="dialog-footer" slot="footer">
            <el-button type="primary" @click="saveDialog()">保存</el-button>
            <el-button @click="closeTDialog()">关闭</el-button>
        </div>
    </el-dialog>
</template>

<script>
    import {updateCustomerTransfersApi} from '@/request/api'
    export default {

        name: "exchangeSellerDIalog",
        props: ['exSellerDialogVisible', 'tForm', 'mktLists'],
        data() {
            return {
                tFormRules: {
                    selectMktMode : [
                        {required: true, message: '请选择新的销售人员', trigger: 'change'}
                    ]
                },
                mktModes: [],
                reason: '',
                newForm: {},
            }
        },
        watch: {
            tForm(val) {
                if (!val) return
                this.$set(this, 'newForm', {...val});
            }
        },
        methods: {
            closeTDialog() {
                this.$refs['tForm'].resetFields()
                this.$emit('closeEDialog')
            },
            saveDialog() {
                this.$refs['tForm'].validate(vali => {
                    if (vali) {
                        updateCustomerTransfersApi({
                            customer: {
                                name: this.newForm.name,
                                id: this.newForm.id,
                            },
                            oldSeller: {
                                name: this.newForm.seller.name,
                                id: this.newForm.seller.id,
                            },
                            newSeller: {
                                id: this.newForm.selectMktMode
                            },
                            reason: this.reason
                        }).then(res => {
                            if (res.success === true) {
                                this.$refs['tForm'].resetFields()
                                this.$emit('closeEDialog', true)
                            }
                        })
                    } else {
                        return false
                    }
                })
            }
        },
        created() {
        }
    }
</script>

<style scoped>

</style>